<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>jquery源码解析视频79-1</title>
  <script src="../jquery-2.0.3.js"></script>
</head>

<body>
  <!-- <div>
    div
    <span>span
      <p>p</p>
    </span>
  </div> -->
  <!-- <div class="box">
    div
    <span>span
      <p>p</p>
    </span>
  </div> -->

  <div>
    div
    <span>span
      <p>p</p>
    </span>
    <script>alert(1)</script>
  </div>

  <script>
    $(function () {
      // remove和detach方法都能删除节点
      // $("div").remove();
      // $("div").remove(".box");
      // $("div").detach();

      $("div").click(function () {
        alert(123);
      });
      // remove删除的很干净，连带相关操作(click事件)都一起删除掉了
      // var $div = $("div").remove();
      // detach当还原回来的时候，相关操作仍然还在
      // var $div = $("div").detach();
      // $("body").append($div);

      // cleanData 清除当前元素身上的数据和事件

      // 在标签元素中增加script，remove没有弹两次，跟视频讲的不符  
      // var $div = $("div").remove();
      // $(body).append($div);

      var $div = $("div").detach();
      $(body).append($div);

    });
  </script>
</body>

</html>